const React = require('react');
const ReactDOM = require('react-dom');
const Component = React.Component;
const Tile = require("./Tile");
const Badge = require("Badge");
const FontIcon = require("FontIcon");

class Page extends Component{
    componentDidMount (){
        for(let i in this.refs){
            let ref = this.refs[i];
            let block = ReactDOM.findDOMNode(ref);
            SyntaxHighlighter.highlight({}, block);
        }
    }

    render() {
        return (
            <div className="container">
                <Badge value="25"></Badge>
                <Badge value="4" theme="success"></Badge>
                <Badge value="999" theme="light"></Badge>
                <Badge status="default"></Badge>
                <Badge status="success"></Badge>
                <Badge status="primary"></Badge>
                <Badge status="danger"></Badge>
                <Badge status="warning"></Badge>

                <Badge status="warning" text="WARNING"></Badge>

                <Badge value="25">
                    <FontIcon icon="book" size="3x"></FontIcon>
                </Badge>

                <Badge dot={false}>
                    <FontIcon icon="book" size="3x"></FontIcon>
                </Badge>
            </div>
        )
    }
}

module.exports = Page;